<!--
 * Copyright (c) 2013-Now http://jeesite.com All rights reserved.
 * No deletion without permission, or be held responsible to law.
 * @author XPF
-->
<template>
    <BasicDrawer
      v-bind="$attrs"
      :showFooter="true"
      :okAuth="'sports:sportsSingleIndex:edit'"
      @register="registerDrawer"
      @ok="handleSubmit"
      width="40%"
    >
      <template #title>
        <Icon :icon="getTitle.icon" class="pr-1 m-1" />
        <span> {{ getTitle.value }} </span>
      </template>
      <BasicForm @register="registerForm" />
    </BasicDrawer>
  </template>
  <script lang="ts">
    export default defineComponent({
      name: 'ViewsSportsSportsSingleIndexForm',
    });
  </script>
  <script lang="ts" setup>
    import { defineComponent, ref, computed } from 'vue';
    import { useI18n } from '/@/hooks/web/useI18n';
    import { useMessage } from '/@/hooks/web/useMessage';
    import { router } from '/@/router';
    import { Icon } from '/@/components/Icon';
    import { BasicForm, FormSchema, useForm } from '/@/components/Form';
    import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
    import {
      PhysicalSkillsScore,
      physicalSkillsScoreSelectData,
      physicalSkillsScoreForm,
      physicalSkillsScoreSave,
    } from '/@/api/physical/physicalSkillsScore';
    import { physicalSkillsScoreGradeSelectData } from '/@/api/physical/physicalSkillsScoreGrade';
    import { selectData } from '/@/api/sports/sportsWeight';
  
    const emit = defineEmits(['success', 'register']);
  
    const { t } = useI18n('sports.sportsSingleIndex');
    const { showMessage } = useMessage();
    const record = ref<PhysicalSkillsScore>({} as PhysicalSkillsScore);
    const getTitle = computed(() => ({
      icon: router.currentRoute.value.meta.icon || 'ant-design:book-outlined',
      value: record.value.isNewRecord ? t('新增单项评分规则') : t('编辑单项评分规则'),
    }));
    let termId = ref<Object>('');
    let GradeData = <any>[];
    const inputFormSchemas: FormSchema[] = [
      {
        label: t('指标名称'),
        field: 'termId',
        component: 'Select',
        componentProps: {
          allowClear: true,
          immediate:true,
          api: async () => {
            let res = await physicalSkillsScoreGradeSelectData({termType:1});
            let data = [];
            res.data.forEach((item) => {
              data.push({ label: item.termName, value: item.termId });
            });
            return data;
          },
          onChange: async (e: ChangeEvent) => {
            console.log(e);
            termId.value = { termId: e };
          },
        },
        colProps: { lg: 20, md: 20 },
        required: true,
      },
      {
        label: t('评分适配年级'),
        field: 'scoreAdaptGrade',
        component: 'Select',
        componentProps: {
          dictType: 'vke_grade',
        },
        colProps: { lg: 20, md: 20 },
        required: true,
      },
      {
        label: t('评分适配性别'),
        field: 'scoreAdaptSex',
        component: 'RadioGroup',
        componentProps: {
          dictType: 'sys_user_sex',
        },
        colProps: { lg: 20, md: 20 },
        required: true,
      },
      // {
      //   label: t('符号'),
      //   field: 'scoreSymbol',
      //   component: 'RadioGroup',
      //   componentProps: {
      //     dictType: 's_scoring_rules',
      //     onChange: (e: ChangeEvent) => {
      //       console.log(e);
      //     },
      //   },
      //   colProps: { lg: 20, md: 20 },
      // },
      {
        label: t('分值'),
        field: 'score1',
        component: 'Input',
        componentProps: {
          maxlength: 5,
        },
        colProps: { lg: 14, md: 10 },
        required: true,
      },
      {
        label: t(''),
        field: 'score2',
        component: 'Input',
        componentProps: {
          maxlength: 5,
        },
        // show: ({ values }) => {
        //   let state;
        //   if (values.scoreSymbol == 1) {
        //     state = true;
        //   } else {
        //     state = false;
        //   }
        //   return !!state;
        // },
        colProps: { lg: 6, md: 10 },
      },
      {
        label: t('等级'),
        field: 'scoreGradeId',
        component: 'Select',
        colProps: { lg: 20, md: 20 },
        componentProps: {
          api: physicalSkillsScoreSelectData,
          resultField:'data',
          params: termId,
          immediate:true,
          // dictType: 's_score_grade',
        },
        required: true,
      },
    ];
  
    const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
      labelWidth: 200,
      schemas: inputFormSchemas,
      baseColProps: { lg: 24, md: 24 },
    });
    const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async (data) => {
      resetFields();
      setDrawerProps({ loading: true });
      console.log(data);
      const res = await physicalSkillsScoreForm(data);
      record.value = (res.physicalSkillsScore || {}) as PhysicalSkillsScore;
      record.value.__t = new Date().getTime();
      setFieldsValue(record.value);
      termId.value = { termId: data.termId };
      setDrawerProps({ loading: false });
    });
  
    async function handleSubmit() {
      try {
        const data = await validate();
        setDrawerProps({ confirmLoading: true });
        const params: any = {
          isNewRecord: record.value.isNewRecord,
          scoreId: record.value.scoreId,
        };
  
        if (data.score2 == undefined) {
          data.score2 = '';
        }
      
        const res = await physicalSkillsScoreSave(params, data);
        showMessage(res.message);
        setTimeout(closeDrawer);
        emit('success', data);
      } catch (error: any) {
        if (error && error.errorFields) {
          showMessage(t('您填写的信息有误，请根据提示修正。'));
        }
        console.log('error', error);
      } finally {
        setDrawerProps({ confirmLoading: false });
      }
    }
  </script>
  